<template>
	<div class="material-container container">
		<div class="search">
			<el-form ref="searchForm" size="small" inline label-width="90px">
				<el-form-item label="关键词：">
					<el-input />
				</el-form-item>
				<el-form-item>
					<el-button type="primary" @click="search(searchForm)">查 询</el-button>
					<el-button @click="reset(searchForm)">重 置</el-button>
					<el-button @click="reset(searchForm)">上传素材</el-button>
				</el-form-item>
			</el-form>
		</div>

		<div class="search-edit">
			<div class="search-tab">
				<el-tabs v-model="searchTabActive" class="tabs">
					<el-tab-pane label="全部" name="all">
						<span slot="label"><i class="el-icon-files" />全部</span>
					</el-tab-pane>
					<el-tab-pane label="图片" name="img">
						<span slot="label"><i class="el-icon-picture-outline" />图片</span>
					</el-tab-pane>
					<el-tab-pane label="视频" name="video">
						<span slot="label"><i class="el-icon-video-camera" />视频</span>
					</el-tab-pane>
					<el-tab-pane label="音频" name="audio">
						<span slot="label"><i class="el-icon-microphone" />音频</span>
					</el-tab-pane>
					<el-tab-pane label="其他" name="other">
						<span slot="label"><i class="el-icon-film" />其他</span>
					</el-tab-pane>
				</el-tabs>
			</div>
		</div>
		<UserSelector :dialog-show.sync="userDialogShow" />
	</div>
</template>

<script>
import UserSelector from '@/components/userSelector'
export default {
	components: {
		UserSelector,
	},
	data() {
		return {
			searchTabActive: 'all',
			userDialogShow: true,
		}
	},
	created() {
		console.log('3123')
	},
	methods: {},
}
</script>

<style scoped lang="scss">
.content {
	background-color: #fff;
}
.el-table {
	margin-bottom: 20px;
}
.search {
	min-width: 1350px;
	background-color: #fff;
	padding: 35px 30px 20px;
	border-radius: 5px;
	margin-bottom: 20px;
}
</style>
